<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Excel导出测试</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            max-width: 800px;
            margin: 0 auto;
            padding: 20px;
        }
        .test-section {
            margin: 20px 0;
            padding: 20px;
            border: 1px solid #ddd;
            border-radius: 5px;
        }
        button {
            background: #409eff;
            color: white;
            border: none;
            padding: 10px 20px;
            border-radius: 4px;
            cursor: pointer;
            margin: 5px;
        }
        button:hover {
            background: #337ecc;
        }
        button:disabled {
            background: #c0c4cc;
            cursor: not-allowed;
        }
        .result {
            margin-top: 10px;
            padding: 10px;
            border-radius: 4px;
        }
        .success {
            background: #f0f9ff;
            border: 1px solid #67c23a;
            color: #67c23a;
        }
        .error {
            background: #fef0f0;
            border: 1px solid #f56c6c;
            color: #f56c6c;
        }
    </style>
</head>
<body>
    <h1>Excel导出功能测试</h1>
    
    <div class="test-section">
        <h3>基础导出测试</h3>
        <button onclick="testBasicExport()" id="basicBtn">测试基础导出</button>
        <div id="basicResult" class="result" style="display: none;"></div>
    </div>
    
    <div class="test-section">
        <h3>详细导出测试</h3>
        <button onclick="testDetailedExport()" id="detailedBtn">测试详细导出</button>
        <div id="detailedResult" class="result" style="display: none;"></div>
    </div>
    
    <div class="test-section">
        <h3>筛选导出测试</h3>
        <button onclick="testFilteredExport()" id="filteredBtn">测试筛选导出</button>
        <div id="filteredResult" class="result" style="display: none;"></div>
    </div>

    <script>
        const API_BASE_URL = 'http://localhost:8000/api';
        const TOKEN = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyX2lkIjoxLCJ1c2VybmFtZSI6ImFkbWluIiwicm9sZSI6ImFkbWluIiwiaWF0IjoxNzYwNDM0NzUwLCJleHAiOjE3NjA0MzgzNTB9.1gHrD45nujqYB6xQjI1uJYw6tfW1rqf-QBVGwUr0eZY';

        async function downloadExcelFile(blob, filename) {
            try {
                if (!blob || blob.size === 0) {
                    throw new Error('文件内容为空');
                }
                
                const url = window.URL.createObjectURL(blob);
                const link = document.createElement('a');
                link.href = url;
                link.download = filename;
                link.style.display = 'none';
                
                document.body.appendChild(link);
                link.click();
                document.body.removeChild(link);
                
                window.URL.revokeObjectURL(url);
                
                return true;
            } catch (error) {
                console.error('下载Excel文件失败:', error);
                throw error;
            }
        }

        async function testBasicExport() {
            const btn = document.getElementById('basicBtn');
            const result = document.getElementById('basicResult');
            
            btn.disabled = true;
            btn.textContent = '导出中...';
            result.style.display = 'none';
            
            try {
                const response = await fetch(`${API_BASE_URL}/students/export`, {
                    method: 'GET',
                    headers: {
                        'Authorization': `Bearer ${TOKEN}`
                    }
                });
                
                if (!response.ok) {
                    throw new Error(`HTTP ${response.status}: ${response.statusText}`);
                }
                
                const blob = await response.blob();
                const timestamp = new Date().toISOString().slice(0, 19).replace(/[:.]/g, '-');
                const filename = `学生信息_${timestamp}.xlsx`;
                
                await downloadExcelFile(blob, filename);
                
                result.className = 'result success';
                result.textContent = `基础导出成功！文件大小: ${(blob.size / 1024).toFixed(2)} KB`;
                result.style.display = 'block';
                
            } catch (error) {
                result.className = 'result error';
                result.textContent = `基础导出失败: ${error.message}`;
                result.style.display = 'block';
            } finally {
                btn.disabled = false;
                btn.textContent = '测试基础导出';
            }
        }

        async function testDetailedExport() {
            const btn = document.getElementById('detailedBtn');
            const result = document.getElementById('detailedResult');
            
            btn.disabled = true;
            btn.textContent = '导出中...';
            result.style.display = 'none';
            
            try {
                const response = await fetch(`${API_BASE_URL}/students/export?type=detailed`, {
                    method: 'GET',
                    headers: {
                        'Authorization': `Bearer ${TOKEN}`
                    }
                });
                
                if (!response.ok) {
                    throw new Error(`HTTP ${response.status}: ${response.statusText}`);
                }
                
                const blob = await response.blob();
                const timestamp = new Date().toISOString().slice(0, 19).replace(/[:.]/g, '-');
                const filename = `学生详细信息_${timestamp}.xlsx`;
                
                await downloadExcelFile(blob, filename);
                
                result.className = 'result success';
                result.textContent = `详细导出成功！文件大小: ${(blob.size / 1024).toFixed(2)} KB`;
                result.style.display = 'block';
                
            } catch (error) {
                result.className = 'result error';
                result.textContent = `详细导出失败: ${error.message}`;
                result.style.display = 'block';
            } finally {
                btn.disabled = false;
                btn.textContent = '测试详细导出';
            }
        }

        async function testFilteredExport() {
            const btn = document.getElementById('filteredBtn');
            const result = document.getElementById('filteredResult');
            
            btn.disabled = true;
            btn.textContent = '导出中...';
            result.style.display = 'none';
            
            try {
                const response = await fetch(`${API_BASE_URL}/students/export?major=计算机科学与技术&status=enrolled`, {
                    method: 'GET',
                    headers: {
                        'Authorization': `Bearer ${TOKEN}`
                    }
                });
                
                if (!response.ok) {
                    throw new Error(`HTTP ${response.status}: ${response.statusText}`);
                }
                
                const blob = await response.blob();
                const timestamp = new Date().toISOString().slice(0, 19).replace(/[:.]/g, '-');
                const filename = `学生筛选导出_${timestamp}.xlsx`;
                
                await downloadExcelFile(blob, filename);
                
                result.className = 'result success';
                result.textContent = `筛选导出成功！筛选条件: 专业=计算机科学与技术, 状态=在读, 文件大小: ${(blob.size / 1024).toFixed(2)} KB`;
                result.style.display = 'block';
                
            } catch (error) {
                result.className = 'result error';
                result.textContent = `筛选导出失败: ${error.message}`;
                result.style.display = 'block';
            } finally {
                btn.disabled = false;
                btn.textContent = '测试筛选导出';
            }
        }
    </script>
</body>
</html>
